<template>
  <div class="navber">
    <Collapse></Collapse>
    <BredCum></BredCum>
    <div class="navber-right">
      <Lang></Lang>
      <Avatar></Avatar>
    </div>
  </div>
</template>

<script setup lang="ts">
import Collapse from "./Collapse.vue";
import BredCum from "./BredCum.vue";
import Avatar from "./Avatar.vue";
import Lang from "./Lang.vue"
</script>

<style lang='scss' scoped>
.navber {
    width: 100%;
    height: 60px;
    overflow: hidden;
    padding: 0 20px 0 10px;
    display: flex;
    align-items: center;
    box-sizing: border-box;
  .navber-right {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }
}
</style>